﻿
@{
    ViewBag.Title = "JiXiao";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="row" id="app">
    <div class="col-xs-12">
        <!--人员列表-->
        <div class="row" id="list">
            <div class="col-xs-12">
                <div class="table-header">
                    教职工列表
                </div>

                <div>
                    <table class="table table-striped table-bordered table-hover">
                        <thead>
                            <tr>
                                <th class="center">
                                    账号/编号
                                </th>
                                <th>姓名</th>
                                <th>性别</th>
                                <th>手机号</th>
                                <th>所在科室</th>
                                <th>职务</th>
                                <th></th>
                            </tr>
                        </thead>

                        <tbody>
                            <tr v-for="tr in users">
                                <td class="center">
                                    {{tr.username}}
                                </td>
                                <td>{{tr.XingMing}}</td>
                                <td>
                                    <template v-if="tr.XingBie==0">
                                        未知
                                    </template>
                                    <template v-if="tr.XingBie==1">
                                        男
                                    </template>
                                    <template v-if="tr.XingBie==2">
                                        女
                                    </template>
                                </td>
                                <td>{{tr.ShouJiHao}}</td>
                                <td>{{tr.keshi.ksmc}}</td>
                                <td>{{tr.zwmc}}</td>
                                <td>
                                    <div class="btn-group">
                                        <button data-toggle="dropdown" class="btn btn-primary btn-white dropdown-toggle btn-sm " aria-expanded="true">
                                            考核范围
                                            <i class="ace-icon fa fa-angle-down icon-on-right"></i>
                                        </button>

                                        <ul class="dropdown-menu">
                                            <li>
                                                <a href="javascript:void(0)" v-on:click="ShowGongZuoJiHuaList(tr.username)">配置绩效</a>
                                            </li>

                                            <li>
                                                <a href="javascript:void(0)" v-on:click="p_DelData(tr.userinfoId)">一键清除配置</a>
                                            </li>
                                        </ul>
                                    </div>
                                </td>
                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <!--配置考核范围-->
        <div id="config" class="row" style="display: none">
            <div class="col-lg-12 widget-container-col">
                <!-- #section:custom/widget-box -->
                <div class="widget-box">
                    <div class="widget-header">
                        <h5 class="widget-title">{{jxinfo.mbmc}} 编辑区</h5>

                        <!-- #section:custom/widget-box.toolbar -->
                        <div class="widget-toolbar">
                            <div class="widget-menu">
                                <a href="#" data-action="settings" data-toggle="dropdown">
                                    <i class="ace-icon fa fa-bars"></i>
                                </a>

                                <ul class="dropdown-menu dropdown-menu-right dropdown-light-blue dropdown-caret dropdown-closer">
                                    <li>
                                        <a data-toggle="tab" href="#dropdown1" v-on:click="ShowRenYuanList()">返回列表</a>
                                    </li>

                                </ul>
                            </div>
                        </div>
                        <!-- /section:custom/widget-box.toolbar -->
                    </div>

                    <div class="widget-body">
                        <div class="widget-main">
                            <div class="row">
                                <div class="col-xs-12">
                                    <!-- /section:custom/widget-box -->
                                    <template v-for="son in jxinfo.JiXiaoNeiRongs">
                                        <table class="table  table-bordered table-hover">
                                            <thead class="thin-border-bottom">
                                                <tr>
                                                    <th>
                                                        项目名称
                                                    </th>
                                                    <th>分值</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        {{son.nr}}
                                                    </td>

                                                    <td>
                                                        {{son.jxfz}}
                                                    </td>
                                                </tr>
                                                <tr class="detail-row open">
                                                    <td colspan="2">
                                                        <div class="table-detail">
                                                            <div class="row">
                                                                <div class="col-xs-12">
                                                                    <p>
                                                                        <span class="label label-xlg label-primary arrowed arrowed-right">考核范围</span>
                                                                        <button class="btn btn-white btn-success btn-bold" type="button" v-on:click="ShowKeShiList(son)">
                                                                            <i class="ace-icon glyphicon glyphicon-plus bigger-120 orange"></i>
                                                                            新增
                                                                        </button>
                                                                    </p>
                                                                    <table class="table table-striped table-bordered table-hover no-margin-bottom no-border-top">
                                                                        <thead>
                                                                            <tr>
                                                                                <th>科室名称</th>
                                                                                <th>考核职位</th>
                                                                                <th>操作</th>
                                                                            </tr>
                                                                        </thead>
                                                                        <tbody>
                                                                            <tr v-for="fwkeshi in son.KaoHeFanWeis">
                                                                                <td>
                                                                                    {{fwkeshi.ksmc}}
                                                                                </td>
                                                                                <td>
                                                                                    {{fwkeshi.ZhiWustr}}
                                                                                </td>

                                                                                <td>
                                                                                    <p>
                                                                                        <button class="btn btn-white btn-warning btn-bold btn-sm" type="button" v-on:click="DelSelectKeShi(son,fwkeshi)">
                                                                                            <i class="ace-icon fa fa-trash-o bigger-120 orange"></i>
                                                                                            删除
                                                                                        </button>
                                                                                    </p>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </template>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>


            </div>
        </div>
        <!--弹出框1-->
        <div class="row">
            <div class="col-xs-12">
                <div id="dialog-message" class="hide">
                    <div class="row">
                        <div class="col-xs-12">
                            <table class="table table-striped table-bordered table-hover">
                                <thead>
                                    <tr>
                                        <th class="center">
                                            绩效名称
                                        </th>
                                        <th></th>
                                    </tr>
                                </thead>

                                <tbody>
                                    <tr v-for="tr in jxlist">
                                        <td class="center">
                                            {{tr.mbmc}}
                                        </td>

                                        <td>
                                            <button class="btn btn-white btn-info btn-bold" v-on:click="ShowJiXiaoInfo(tr)">

                                                选中
                                            </button>
                                        </td>
                                    </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div><!-- #dialog-message -->
            </div>
        </div>

        <!--弹出框2-->
        <div class="row">
            <div class="col-xs-12">
                <div id="keshi" class="hide">
                    <div class="row" id="keshilist">
                        <div class="col-xs-12">
                            <table class="table table-striped table-bordered table-hover">
                                <thead>
                                    <tr>
                                        <th class="center">
                                            科室
                                        </th>

                                        <th></th>
                                    </tr>
                                </thead>

                                <tbody>
                                    <tr v-for="tr in keshilist">
                                        <td class="center">
                                            {{tr.ksmc}}
                                        </td>
                                        <td>
                                            <button class="btn btn-white btn-info btn-bold" v-on:click="ShowZhiWu(tr)">

                                                选中
                                            </button>
                                        </td>
                                    </tr>

                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div class="row" id="zhiwulist" style="display: none">
                        <div class="col-lg-12 widget-container-col">
                            <!-- #section:custom/widget-box -->
                            <div class="widget-box">
                                <div class="widget-header">
                                    <h5 class="widget-title">选择职务</h5>

                                    <!-- #section:custom/widget-box.toolbar -->
                                    <div class="widget-toolbar">
                                        <div class="widget-menu">
                                            <a href="#" data-action="settings" data-toggle="dropdown">
                                                <i class="ace-icon fa fa-bars"></i>
                                            </a>

                                            <ul class="dropdown-menu dropdown-menu-right dropdown-light-blue dropdown-caret dropdown-closer">
                                                <li>
                                                    <a data-toggle="tab" href="#dropdown1" v-on:click="ShowKeShi()">返回列表</a>
                                                </li>

                                            </ul>
                                        </div>
                                    </div>
                                    <!-- /section:custom/widget-box.toolbar -->
                                </div>

                                <div class="widget-body">
                                    <div class="widget-main">
                                        <div class="row">
                                            <div class="col-xs-12">
                                                <!-- /section:custom/widget-box -->
                                                <table class="table table-striped table-bordered table-hover">
                                                    <thead>
                                                        <tr>
                                                            <th class="center">
                                                                职务
                                                            </th>
                                                            @*<th class="center">
                                                                    是否选中
                                                                </th>*@
                                                        </tr>
                                                    </thead>

                                                    <tbody>
                                                        <template v-for="tr in zhiwulist">
                                                            <tr>
                                                                <td class="center">
                                                                    <a href="javascript:void(0)" v-on:click="ClickZhiWu(tr)">{{tr.zwmc}}</a>
                                                                </td>
                                                                @*<td>

                                                                    </td>*@
                                                            </tr>
                                                            <template v-for="sontr in tr.SonZhiWeis">
                                                                <tr>
                                                                    <td class="center">
                                                                        <a href="javascript:void(0)" v-on:click="ClickZhiWu(sontr)">{{sontr.zwmc}}</a>
                                                                    </td>
                                                                    @*<td>
                                                                        选中/未选中
                                                                    </td>*@
                                                                </tr>
                                                            </template>
                                                        </template>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div><!-- #dialog-message -->
            </div>
        </div>
    </div>
</div>
<script src="~/Scripts/JsModel/Model_JiXiao.js"></script>
<script src="~/Scripts/JsModel/Model_KeShi.js"></script>
<script type="text/javascript">

    var vm = new Vue({
        el: '#app',
        data: {
            users: [],
            username:"",
            keshilist: [],
            jxlist: [],
            jxinfo: new JiXiao(),
            sousuo: { keyword: "", ksid: 0, zwid: 0, pageIndex: 1, pageSize: 10 },
            zhiwulist: [],
            jxdialog: {},
            jxksdialog: {},
            keshiinfo: new KeShi(),
            JiXiaoNeiRonginfo: new sonjixiao()
        },
        mounted() {
            this.p_GetEmployeeDatas();
        },
        methods: {
            p_GetEmployeeDatas: function() {
                var _self = this;
                var para = {
                    params: {
                        keyword: _self.sousuo.keyword,
                        ksid: _self.sousuo.ksid,
                        zwid: _self.sousuo.zwid,
                        pageIndex: _self.sousuo.pageIndex,
                        pageSize: _self.sousuo.pageSize
                    }
                }
                axios.get('@Url.Action("GetJiaoZhiGongs", "KaoHeBanWei")', para).then(
                        function(response) {
                            _self.users = [];
                            for (var i = 0; i < response.data.data.length; i++) {
                                _self.users.push(response.data.data[i]);
                            }
                        },
                        function(response) {
                            alert(response.status);
                        }
                    )
                    .catch(
                        function(error) {
                            alert(error);
                        }
                    );
            },
            p_GetJXs: function() {
                var _self = this;
                axios.get("@Url.Action("GetJXs", "KaoHeBanWei")").then((response) => {
                        _self.jxlist = [];
                        for (var i = 0; i < response.data.length; i++) {
                            _self.jxlist.push(response.data[i]);
                        }
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            p_GetAllKeShi: function() { //获取全部科室
                var _self = this;
                axios.get("@Url.Action("GetAllKeShi", "KaoHeBanWei")").then((response) => {
                        _self.keshilist = [];
                        for (var i = 0; i < response.data.length; i++) {
                            _self.keshilist.push(new KeShi(response.data[i]));
                        }
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            p_GetKeShiNeiZhiWu: function(ksid) {
                var _self = this;
                axios.get("@Url.Action("GetKeShiZhiWu", "KaoHeBanWei")", { params: { keshiid: ksid } }).then((response) => {
                        _self.zhiwulist = [];
                        for (var i = 0; i < response.data.length; i++) {
                            _self.zhiwulist.push(response.data[i]);
                        }
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            p_SaveKaoHeZhiWu: function (nrid,zwid) {
                var _self = this;
                axios.get("@Url.Action("SaveKaoHeZhiWu", "KaoHeBanWei")", { params: { nrid:nrid, zwid: zwid,username:_self.username } }).then((response) => {
                        bootbox.alert("成功");
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            p_DelFanWeiKeShi: function(nrid,zwids) {
                axios.get("@Url.Action("DelKaoHeFanWei", "KaoHeBanWei")", { params: { nrid: nrid, zwids: zwids } }).then((response) => {
                        bootbox.alert("成功");
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            p_GetJiXiao: function (mbid, username) {
                var _self = this;
                axios.get("@Url.Action("GetJX", "KaoHeBanWei")", { params: { mbid: mbid, username: username}}).then((response) => {
                    _self.jxinfo = new JiXiao(response.data);
                    },
                    (response) => {

                    }
                ).catch(function(response) {
                    console.log(response);
                });
            },
            ShowGongZuoJiHuaList: function (username) {
                this.username = username;
                this.p_GetJXs();
                this.jxdialog = dialog_comm(false,"dialog-message", "选择绩效", null, function () { }, true, 600);
            },
            ShowKeShiList: function (obj) {
                this.p_GetAllKeShi();
                $("#zhiwulist").hide(function () {
                    $("#keshilist").show();
                });
                this.JiXiaoNeiRonginfo = obj;
                this.jxksdialog = dialog_comm(false,"keshi", "科室信息", null, function() {}, true, 600);
            },
            ShowJiXiaoInfo: function(obj) {
                var _self = this;
                _self.p_GetJiXiao(obj.mbid,_self.username);
                $("#list").hide(function() {
                    $("#config").show();
                });
                _self.jxdialog.dialog("close");
            },
            ShowRenYuanList: function() {
                $("#config").hide(function () {
                    $("#list").show();
                });
            },
            ShowZhiWu: function (obj) {
                this.keshiinfo = new KeShi({ ksmc: obj.ksmc, ksid: obj.ksid });
                this.p_GetKeShiNeiZhiWu(obj.ksid);
                $("#keshilist").hide(function() {
                    $("#zhiwulist").show();
                });
            },
            ShowKeShi: function() {
                $("#zhiwulist").hide(function() {
                    $("#keshilist").show();
                });
            },
            ClickZhiWu: function (obj) {
                var _self = this;
                _self.p_SaveKaoHeZhiWu(_self.JiXiaoNeiRonginfo.nrid,obj.zwid);
                    var index = -1;
                    $(_self.JiXiaoNeiRonginfo.KaoHeFanWeis).each(function (i2, item2) {
                        if (item2.ksid == _self.keshiinfo.ksid) {
                            index = i2;
                            var index2 = -1;
                            $(item2.ZhiWus).each(function(i3, item3) {
                                if (item3.zwid == obj.zwid) {
                                    index2 = i3;
                                    return false;
                                }
                            });
                            if (index2 < 0) {
                                item2.ZhiWus.push({ zwid: obj.zwid, zwmc: obj.zwmc });
                                item2.ZhiWustr = GetZhiWumc(item2.ZhiWus);
                            }
                        }
                    });
                    if (index < 0) {
                        _self.keshiinfo.ZhiWus.push({ zwid: obj.zwid, zwmc: obj.zwmc });
                        _self.JiXiaoNeiRonginfo.KaoHeFanWeis.push(new KeShi(_self.keshiinfo));
                        return false;
                    }
            },
            DelSelectKeShi: function (nrmodel, obj) {
                var _self = this;
                _self.JiXiaoNeiRonginfo = nrmodel;
                var zwids = [];
                $(obj.ZhiWus).each(function(i,item) {
                    zwids.push(item.zwid);
                });
                _self.p_DelFanWeiKeShi(_self.JiXiaoNeiRonginfo.nrid,zwids.join("|"));
                var index = -1;
                $(_self.JiXiaoNeiRonginfo.KaoHeFanWeis).each(function(i2, item2) {
                    if (item2.ksid == obj.ksid) {
                        index = i2;
                        return false;
                    }
                });
                if (index >= 0) {
                    _self.JiXiaoNeiRonginfo.KaoHeFanWeis.splice(index, 1);
                }
            }
            }
    });
</script>